import React, {Component} from 'react';
import {Relax} from 'iflux2';
import {List, Map, fromJS} from 'immutable';

import {stepQL, currentQL} from '../ql';

import {Row, Col, Steps} from 'antd';
const Step = Steps.Step;

@Relax
export default class OrderStep extends Component {
    static defaultProps = {
        detail: Map(),
        steps: stepQL,
        current: currentQL
    }


    render() {
        const {detail, steps, current} = this.props;

        return (
            <div>
                <div className="order-top">
                    <Row>
                        <Col span={18}>
                            <div className="font-14">
                                <b>订单编号：</b><span className="t-grayer">{detail.get('tid')}</span>
                            </div>
                        </Col>
                        <Col span={6}>
                            <div className="t-right t-grayer">
                                <span className="ml30">{`${!!detail.get('saleManName') ? `业务员：${detail.get('saleManName')}` : ''}`}</span>
                            </div>
                        </Col>
                    </Row>
                </div>
                {
                    current == 5 || current == 6
                        ?
                        null
                        :
                        <div className="order-step">
                            <div className="steps">
                                <Steps current={current}>
                                    {
                                        steps.map((step, index)=><Step key={index}
                                                                       title={step.get('title')}
                                                                       description={<span className="t-grayer">{step.get('time')}</span>}/>).toArray()
                                    }
                                </Steps>
                            </div>
                        </div>
                }
            </div>
        )
    }
}